<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <meta name="generator" content=
  "HTML Tidy for Linux/x86 (vers 25 March 2009), see www.w3.org" />
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

  <title>ECG Monitor</title>
  <link href="layout.css" rel="stylesheet" type="text/css" />
  <!--[if IE]><script language="javascript" type="text/javascript" src="../excanvas.min.js"></script><![endif]-->

  <script language="javascript" type="text/javascript" src="../jquery.min.js">
</script>
  <script language="javascript" type="text/javascript" src="../jquery.flot.min.js">
</script>
  <script language="javascript" type="text/javascript" src=
  "../jquery.flot.selection.min.js">
</script>
  <script id="source" language="javascript" type="text/javascript" src=
  "script.js">
</script>
</head>

<body>
  <h1>ECG Monitor</h1>
<h2>Step 1: Upload JSON data file</h2>

<input type="file" id="path" /><button>LoadData</button>

<h2>Step 2: View ECG waveform</h2>
  <div>

    <div id="placeholder" class="c1">
      Loading defaults...
    </div>

    <div id="miniature" class="c4">
      <div id="overview" class="c2"></div>
      <!--p id="overviewLegend" class="c3"></p-->
    </div>
  </div>
<hr  class="clear" />
<h2>Step 3: Optional functions</h2>
  <p>Choose a data series from below. The webpage will dynamically
  download the pre-encoded ECG file from server and plot it in the above
  window.</p><select id="series">
    <option value="blwand">
      Baseline Wandering
    </option>

    <option value="line">
      Line Interference
    </option>

    <option selected="selected" value="pure">
      No_noise
    </option>

    <!--option value="random">
      Random noise
    </option-->

    <option value="ripple">
      Ripple noise
    </option>
    <option value="low_battery">
      Low battery power
    </option>

    <option value="tremor">
      Tremor
    </option>
    <option value="wrong_side">
      Treacherous technician syndrome
    </option>
  </select> <span id="loading">Loading...</span>

  <p>Select time ranges in either the plot or the mini-plot. The plot will zoom
  to the selected ranges automatically.</p>

  <p>Click "play" to playback ECG signal in (simulated) real time. Click
  "pause" or select time ranges on the plots to stop the animation. Animation
  performance varies among hardwares and browsers; currently only IE9 (not yet
  released) supports 3D-card acceleration.</p>

  <p><button id="playback">Play</button> <button id="pause">Pause</button></p>

  <p>MiniDAQ Raw File upload and conversion is under construction.</p>

  <p>Filtering on the server-side is a problem because none of the servers I
  have known can install MATLAB. (hkueee2 server has MATLAB support, but I
  don't have permission to access.)</p>
</body>
</html>

